<div class="search-result">
  <app-head></app-head>
  <div class="search-title">
    <h1>检索结果</h1>
    <!--<div>POLICY RESULTS</div>-->
  </div>
  <nz-spin [nzSpinning]="isSpinning">
    <div class="result-total">
      <div class="result-tree">
        <nz-tree
          #wordFrameTree
          nzShowIcon
          [nzData]="treeNodes"
          (nzClick)="treeClick($event)"
          [nzTreeTemplate]="nzTreeTemplate"
        >
        </nz-tree>
        <ng-template #nzTreeTemplate let-node let-origin="origin">
      <span class="custom-node">
        <span *ngIf="!node.isLeaf">
          <span class="folder-name" [ngClass]="topWordBold(node)?'':'top-word-bold'"
                [innerHTML]="node.title">{{ node.title }}</span>
        </span>
        <span *ngIf="node.isLeaf">
          <i nz-icon style="font-size: 12px; margin-right: 6px" *ngIf="node.level===3">
            <svg><path d="M512 69.479l442.498 442.498-442.498 442.498-442.498-442.498 442.498-442.498z" p-id="2202"
                       fill="#034ea2"></path></svg>
          </i>
          <span class="file-name" [ngClass]="topWordBold(node)?'':'top-word-bold'"  [innerHTML]="node.title">{{ node.title }}</span>
        </span>
      </span>
        </ng-template>
      </div>
      <div class="result">
        <div class="result-wrap">
          <div class="result-checkbox">
            <!--            <div class="checkbox">-->
            <!--              <div class="checkbox-label">-->
            <!--                政策专题-->
            <!--              </div>-->
            <!--              <div class="box">-->
            <!--                <nz-checkbox-group [(ngModel)]="wordFreamList"-->
            <!--                                   (ngModelChange)="clickBoxWord($event)"></nz-checkbox-group>-->
            <!--              </div>-->
            <!--            </div>-->
            <div class="checkbox">
              <div class="checkbox-label">
                颁布地域
              </div>
              <div class="box">
                <nz-checkbox-group [(ngModel)]="regions" (ngModelChange)="clickBoxRegions($event)"></nz-checkbox-group>
              </div>
            </div>
            <div class="checkbox">
              <div class="checkbox-label">
                颁布年份
              </div>
              <div class="box">
                <nz-checkbox-group [(ngModel)]="years" (ngModelChange)="clickBoxYears($event)"></nz-checkbox-group>
              </div>
            </div>
            <div class="checkbox">
              <div class="checkbox-label">
                关键词
              </div>
              <div class="box">
                <nz-checkbox-group [(ngModel)]="key" (ngModelChange)="clickBoxKey($event)"></nz-checkbox-group>
              </div>
            </div>
          </div>
          <div class="result-content">
            <div class="preview">
              <button nz-button nzType="primary" style="background-color: #034ea2;float: right"
                      (click)="toMatrix()">政策矩阵对比分析
              </button>
              <div class="preview-title">
                检索结果预览
              </div>
              <div class="selected-area">
                <div class="area-title" *ngIf="tags.length">已选条件</div>
                <div class="tag">
                  <nz-tag nzColor="#034ea2"
                          *ngFor="let tag of tags">{{(tag.prefix ? tag.prefix : '') + tag.label}}</nz-tag>
                </div>
              </div>
              <h3 class="total-number">
                符合条件的政策共{{articleTotal}}条
              </h3>
              <div class="result-list">
                <div class="list-article" *ngFor="let article of articleData" routerLink="/new-policy-detail"
                     [queryParams]="{id: article.id,type:'相关政策'}">
                  <div class="article-top">
                    <h3 class="article-title">
                      {{article.title}}
                    </h3>
                    <div class="article-link">
                      <i nz-icon nzType="link" nzTheme="outline"></i>
                      <a [href]="article.url" (click)="stopBubbling($event)" target="_blank">原文链接</a>
                    </div>
                  </div>

                  <div class="article" [innerHTML]="article.searchContent"></div>
                  <div class="article-bottom">
                    <div class="publish-organ">
                      颁布单位：[{{article.publishOrgans}}]
                    </div>
                    <div class="publish-time">
                      发布日期：{{article.publishDate}}
                    </div>
                  </div>

                </div>
              </div>
            </div>
            <div class="Legend" *ngIf="chartIsShow">
              <div class="legend-bar">
                <app-number-evolution [heightCount]="'300px'" [dataBySearch]="countWithYear"></app-number-evolution>
              </div>
              <div class="legend-text">政策数量演进</div>
              <div class="legend-bar">
                <app-area-spread [heightCount]="'300px'" [dataBySearch]="countWithRegion"></app-area-spread>
              </div>
              <div class="legend-text">政策地域分布</div>
              <div class="legend-bar">
                <app-publish-organ-chart [heightCount]="'300px'" [dataBySearch]="countWithPublishOrgan"></app-publish-organ-chart>
              </div>
              <div class="legend-text">发布机构分布</div>
              <div class="legend-bar">
                <app-policy-spread-chart [heightCount]="'300px'" [dataBySearch]="spreadResponse"></app-policy-spread-chart>
              </div>
              <div class="legend-text">政策扩散</div>
              <div class="legend-bar">
                <app-policy-focus-chart [heightCount]="'300px'" [dataBySearch]="policyKetwordYuntu"></app-policy-focus-chart>
<!--                <app-quarter-keyword-bar [heightCount]="'300px'"></app-quarter-keyword-bar>-->
              </div>
              <div class="legend-text">政策热点聚焦</div>
              <div class="legend-bar">
                <app-organ-post-chart [heightCount]="'300px'" [dataBySearch]="publishOrganSpreadResponse"></app-organ-post-chart>
              </div>
              <div class="legend-text">机构合作发文</div>
            </div>
          </div>

        </div>
      </div>

    </div>
  </nz-spin>

</div>
<div class="h-foot">
  <div class="text">
    <div class="address">上海推进科技创新中心建设办公室 版权所有</div>
    <div class="address2">地址：上海市浦东新区张东路1158号3号楼 &nbsp;&nbsp;&nbsp;&nbsp; 联系电话 : 021-68796635</div>
    <div class="phone">技术支持 : 中国科学院文献情报中心</div>
    <a class="nav" href="/admin/" target="_blank">后台入口</a>
  </div>
</div>
